{% load static i18n  %}

<!-- Left navbar links -->
<ul class="navbar-nav">
  <li class="nav-item">
    <a class="nav-link" data-widget="pushmenu" href="#" data-enable-remember="false" role="button"><i class="fas fa-bars"></i></a>
  </li>
</ul>

<!-- SEARCH FORM -->
<form action="{% url 'admin:search' %}" class="form-inline ml-3">
  <div class="input-group input-group-sm">
    <div class="dropdown input-group-prepend advanced-search">
      <button type="button" class="btn btn-light dropdown-toggle" id="dropdownMenuOffset" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-offset="10,20"></button>
      <div class="dropdown-menu" aria-labelledby="dropdownMenuOffset">
        <div class="p-3">
          <div class="form-group p-1">
            <label for="search">{% trans "Content" %}</label>
            <input type="search" name="qa" class="form-control" placeholder="{% trans 'Search' %}">
          </div>
          <div class="form-group p-1">
            <label for="id_folder">{% trans "In Folder" %}</label>
            {{ form.folder }}
          </div>
          <div class="form-group p-1">
            <label>{% trans "With" %}</label>
            <select name="tags_op" class="ml-2 mr-2">
                <option value="all" selected>{% trans "All" %}</option>
                <option value="any">{% trans "Any" %}</option>
            </select>
            <label>{% trans "Tags" %}</label>
            <div class="av-tags-container d-flex my-1">
              <input type="text" class="form-control" list="all_tags" class="tag-input" />
            </div>
            <datalist id="all_tags">
              {% for tag in alltags %}
                   <option value="{{ tag.name }}">
              {% endfor %}
            </datalist>
          </div>
          <div class="py-2">
            <button type="submit" class="btn btn-success w-100">
              {% trans "Advanced Search" %}
              <i class="fas fa-search-plus ml-1"></i>
            </button>
          </div>
        </div>
      </div>
    </div>
    <input class="form-control form-control-navbar" type="search" name="q" placeholder="{% trans 'Search' %}" aria-label="Search">
    <div class="input-group-append">
      <button class="btn btn-navbar" type="submit">
        <i class="fas fa-search"></i>
      </button>
    </div>
  </div>
</form>

<!-- Right navbar links -->
<ul class="navbar-nav ml-auto">
  <!-- User Dropdown Menu -->
  <li class="nav-item dropdown mx-3">
    <a class="dropdown-toggle" aria-expanded="false" data-toggle="dropdown" href="#">
      <i class="fa fa-user"></i>
      {% firstof user.get_short_name user.get_username %}
    </a>
    <ul class="dropdown-menu">
      <li class="dropdown-item">
        {% if has_perm_change_user %}
          <a href="{% url 'account_change_password' %}"><i class="fa fa-asterisk mx-2"></i>
            {% trans 'Change Password' %}
          </a>
        {% endif %}
      </li>
      <li class="dropdown-item">
        <a href="{% url 'core:tokens' %}"><i class="fa fa-user-secret mx-2"></i>
          {% trans 'API Tokens' %}
        </a>
      </li>
      <li class="dropdown-item">
        <a href="{% url 'core:preferences' %}"><i class="fa fa-cogs mx-2"></i>
          {% trans 'Preferences' %}
        </a>
      </li>
      {% for item in user_menu %}
          <li class="dropdown-item">
            <a href="{{item.url}}"><i class="{{item.icon_css_class}} mx-2"></i>
              {{item.title}}
            </a>
      </li>
      {% endfor %}
      <div class="dropdown-divider"></div>
      <li class="dropdown-item">
        <a target="_blank" href="https://papermerge.readthedocs.io/en/latest/"><i class="fa fa-book-open mx-2"></i>
          {% trans 'Documentation' %}
        </a>
      </li>
      <div class="dropdown-divider"></div>
      <li class="dropdown-item">
        <a href="{% url 'account_logout' %}"><i class="fa fa-sign-out-alt mx-2"></i>
        {% trans 'Log out' %}
        </a>
      </li>
    </ul>
  </li>
  <li class="nav-item mx-3">
    <a data-widget="control-sidebar" data-slide="true" href="#" role="button"><i
        class="fas fa-th-large"></i></a>
  </li>
</ul>